<%@page import="org.springframework.web.bind.annotation.RequestMapping"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="../js/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript" src="../js/jquery-1.11.1.min.js"></script>
<link href="../js/bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="../laypage/skin/laypage.css"  rel="stylesheet">
<!-- 可选的Bootstrap主题文件（一般不使用） -->
<script src="../js/bootstrap/css/bootstrap-theme.min.css"></script>
<link rel="stylesheet" type="text/css" href="../mycss/style.css" />
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script type="text/javascript" src="../laypage/laypage.js"></script>
<script src="../js/bootstrap/js/bootstrap.min.js"></script>
<script language="javascript" type="text/javascript" src="../My97DatePicker/WdatePicker.js"></script>
<title>Insert title here</title>
</head>
<body id="tablePage">
 <div >	
		<blockquote>
			<p class="twoType">客户发展计划</p>
		</blockquote> 	
		<hr/>
	<!-- 按月份查询计划规划 -->
	<div>
	    <form>
	    <span>月份：</span>
	    <input type="text" name="schMonth" id="schMonth0" class="Wdate" onClick="WdatePicker({dateFmt:'MM'})">
	    <input type="button" value="查询" onclick="selectByCondition(1)">
	    </form>
	</div>
<!-- Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal" >
添加
</button>

<!-- Modal 添加-->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">添加客户发展计划</h4>
      </div>
      <div class="modal-body">
      
      <form id="addSchedule" class="form-inline" method="post">
         <table class="class">
         <tr><th>计划人姓名：</th><td><input type="text" id="schPerson1" name="schPerson"></td></tr>
         <tr><th>计划月份：</th><td><input type="text" id="schMonth1" name="schMonth" class="Wdate" onClick="WdatePicker({dateFmt:'yyyy-MM-dd'})"></td></tr>
         <tr><th>计划状态：</th><td><input type="text" id="schState1" name="schState"></td></tr>
         <tr><th>计划内容：</th><td><input type="text" id="schContent1" name="schContent"></td></tr>
         </table>           
                           
      </form>
      
      </div>
     
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-primary" onclick="addSchedule()">添加计划表</button>
      </div>
    </div>
  </div>
</div>
	 
<!-- Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal1" onclick="updateData()" >
修改
</button>

<!-- Modal1 修改-->
<div class="modal fade" id="myModal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">修改客户发展计划</h4>
      </div>
      <div class="modal-body">
      
      <form id="updateSchedule" class="form-inline" method="post">
         <table class="class">
	         <tr><th>计划编码：</th><td><input type="text" id="schId2" name="schId"></td></tr>
	         <tr><th>计划人姓名：</th><td><input type="text" id="schPerson2" name="schPerson"></td></tr>
	         <tr><th>计划月份：</th><td><input type="text" id="schMonth2" name="schMonth" class="Wdate" onClick="WdatePicker({dateFmt:'yyyy-MM-dd'})"></td></tr>
	         <tr><th>计划状态：</th><td><input type="text" id="schState2" name="schState"></td></tr>
	         <tr><th>计划内容：</th><td><input type="text" id="schContent2" name="schContent"></td></tr>
         </table>         
      </form>
      
      </div>
     
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-primary" onclick="updateSchedule()">修改计划表</button>
      </div>
    </div>
  </div>
</div>

<!-- Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal2" onclick="delData()" >
删除
</button>

<!-- Modal2 删除-->
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">删除客户发展计划</h4>
      </div>
      <div class="modal-body">
      
      <form id="delSchedule" method="post" class="form-inline" >
         <table class="class">
	         <tr><th>计划编码：</th><td><input type="text" id="schId3" name="schId"></td></tr>
	         <tr><th>计划人姓名：</th><td><input type="text" id="schPerson3" name="schPerson"></td></tr>
	         <tr><th>计划月份：</th><td><input type="text" id="schMonth3" name="schMonth" class="Wdate" onClick="WdatePicker({dateFmt:'yyyy-MM-dd'})"></td></tr>
	         <tr><th>计划状态：</th><td><input type="text" id="schState3" name="schState"></td></tr>
	         <tr><th>计划内容：</th><td><input type="text" id="schContent3" name="schContent"></td></tr>
         </table> 

      </form>
      
      </div>
     
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-primary" onclick="delSchedule()">删除</button>
      </div>
    </div>
  </div>
</div>

<!-- Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal3" onclick="selData()">
查看
</button>

<!-- Modal 查看-->
<div class="modal fade" id="myModal3" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">查看客户发展计划</h4>
      </div>
      <div class="modal-body">
      
        <form action="" class="form-inline" method="post">
                     计划编码：<span id="schId4" name="schId"></span>
                     计划人姓名：<span id="schPerson4" name="schPerson"></span>
                     计划月份：<span id="schMonth4" name="schMonth"></span>
                     计划状态：<span id="schState4" name="schState"></span>
                     计划内容： <span id="schContent4" name="schContent"></span> 
                     
        <button type="button">取消</button>
        <input type="submit" value="保存"></input>        
      </form>
      
      </div>
     
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <!-- <button type="button" class="btn btn-primary">Save changes</button> -->
      </div>
    </div>
  </div>
</div>    

	 
	<div class="tableDiv">
		<form action="" >
		<table id="conTable" class="table table-bordered">
		  <thead>
			<tr class="info"><td></td><td></td><td>姓名</td><td>月份</td><td>创建时间</td><td>最后操作时间</td><td>操作人</td></tr>
		  </thead>
		  <tbody id="list">
		  
		  </tbody>

         <tfoot>
	      <tr><td id="page000" colspan="7"></td></tr>
          </tfoot>
		</table>	
	
	</form>	
	</div>

</div>

	
</body>
<script type="text/javascript">
var selectByCondition=function(curr){
	var schMonth="-"+$("#schMonth0").val()+"-";
	  $.ajax({
		 url:'../selectByMonth',
		 type:'post',
		 data:{schMonth:schMonth,pageNum:curr},
		 dataType:'json',
		success: function (result) {  								  
		var schJSON=result.schList;
		//获取tbody标签 
		 var tschMes = $('#list');
		tschMes.empty();
		//遍历JSON元素，添加到到Tbody  
	      $.each(result.schList,function(inx,ele){
	    	  $('#list').append('<tr class="active"><td>'+(inx+1)+'</td><td><input type="radio" name="radio" value="'+ele.schId+'" /></td><td>' + ele.schPerson + '</td>' +
                      '<td>' + ele.schMonth + '</td>'+
	                  '<td>'+ ele.schCreateTime +'</td>'+
                     '<td>'+ ele.schHandleTime +'</td>'+ 
                     '<td>'+ ele.schHandler +'</td></tr>')
	      }) 
	      laypage({
				 cont:'page000',//容器 
			     pages:result.totalPages, //总页数
			     curr:curr||1,//当前页
			     skin:'molv',//皮肤
			     skip:true,//
			     last:'尾页',//
			     jump:function(obj,first){
			    	
			    	     if(!first){
			    	    	 selectByCondition(obj.curr);
			    	    	 }
			    	 }
			     
				}) 								
			}
		})
}

$(document).ready(function(){
//1.加载表格中的信息
    loadComments(1);
//页面加载事件
    function loadComments(curr) {
		  $.ajax({
			  url:'../schedule',
			  type:'post',
			  data:{pageNum:curr},
			  dataType:'json',
			  success: function (result) {  
				  var schJSON=result.schList;
			      //获取tbody标签 
				  var tschMes = $('#list');
				  tschMes.empty();
			      //遍历JSON元素，添加到到Tbody  
			      $.each(result.schList,function(inx,ele){
			    	  $('#list').append('<tr class="active"><td>'+(inx+1)+'</td><td><input type="radio" name="radio" value="'+ele.schId+'" /></td><td>' + ele.schPerson + '</td>' +
		                      '<td>' + ele.schMonth + '</td>'+
			                  '<td>'+ ele.schCreateTime +'</td>'+
		                     '<td>'+ ele.schHandleTime +'</td>'+ 
		                     '<td>'+ ele.schHandler +'</td></tr>')
			      }) 

			             
			      laypage({
						 cont:'page000',//容器 
					     pages:result.totalPages, //总页数
					     curr:curr||1,//当前页
					     skin:'molv',//皮肤
					     skip:true,//
					     last:'尾页',//
					     jump:function(obj,first){
					    	
					    	     if(!first){
					    	    	 loadComments(obj.curr);
					    	    	 }
					    	 }
					     
						}) 
			}
		  })
}
})

/* 添加计划表 */
var addSchedule=function(){
	$.ajax({
		url:'../addSchedule',
		type:'post',
		data:$("#addSchedule").serialize(),
		dataType:'json',
		success:function(result){
			alert(result.message);
			window.location.reload(); 
		}
	})
}
/* 修改信息 */
var updateData=function(){
	  var schId=$("input[name='radio']:checked").val();
	  console.log(schId);
	  if(schId!=null){
	  $.ajax({
		  url:'../selSchedule',
		  type:'post',
		  data:{'schId':schId},
		  dataType:'json',
		  success:function(map){
			  var result=map.sch;
			  $('#schId2').val(result.schId);
			  $('#schPerson2').val(result.schPerson);
			  $('#schState2').val(result.schState);
			  $('#schMonth2').val(result.schMonth);
			  $('#schContent2').val(result.schContent);

		  }
	  })
	  }else{
		  alert("请选择员工");
		  window.location.reload();	
	  }
	}
/* 修改计划表 */
var updateSchedule=function(){
	$.ajax({
		url:'../updateSchedule',
		type:'post',
		data:$("#updateSchedule").serialize(),
		dataType:'json',
		success:function(result){
			alert(result.message);
			window.location.reload(); 
		}
	})
}
	/* 传递删除数据id */
    var delData=function(){
	  var schId=$("input[name='radio']:checked").val();
	  if(schId!=null){
	  $.ajax({
		  url:'../selSchedule',
		  type:'post',
		  data:{'schId':schId},
		  dataType:'json',
		  success:function(map){
			  var result=map.sch;
			  $('#schId3').val(result.schId);
			  $('#schPerson3').val(result.schPerson);
			  $('#schState3').val(result.schState);
			  $('#schMonth3').val(result.schMonth);
			  $('#schContent3').val(result.schContent);

		  }
	  })
	  }else{
		  alert("请选择员工");
		  window.location.reload();	
	  }
	}
    /* 删除计划表 */
    var delSchedule=function(){
    	$.ajax({
    		url:'../delSchedule',
    		type:'post',
    		data:$("#delSchedule").serialize(),
    		dataType:'json',
    		success:function(result){
    			alert(result.message);
    			window.location.reload(); 
    		}
    	})
    }
	/* 查看数据 */
    var selData=function(){
  	  var schId=$("input[name='radio']:checked").val();
  	  if(schId!=null){
  	  $.ajax({
  		  url:'../selSchedule',
  		  type:'post',
  		  data:{'schId':schId},
  		  dataType:'json',
  		  success:function(map){
  			  var result=map.sch;
  			  $('#schId4').html(result.schId);
  			  $('#schPerson4').html(result.schPerson);
  			  $('#schState4').html(result.schState);
  			  $('#schMonth4').html(result.schMonth);
  			  $('#schContent4').html(result.schContent);

  		  }
  	  })
  	  }else{
  		  alert("请选择员工");
  		  window.location.reload();	
  	  }
  	}
</script>
</html>